<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
    <ui:composition>
        <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="container ">
                <div class="navbar-header">
                    <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a href="/IDUDaNang/"><img class="logo-img" src="#{application.contextPath}/resources/images/logoIDU.png" alt=""/></a>
                </div>
                <nav class="collapse navbar-collapse bs-navbar-collapse pull-right" role="navigation">
                    <ul class="nav navbar-nav">
                        <li><a href="/IDUDaNang/pages/register.jsf" class="scroll-link" data-id="signup">Sign Up</a></li>
                        <li><a href="#" class="scroll-link" data-id="whatwedo">What we do</a></li>
                        <li><a href="/IDUDaNang/pages/questions.jsf" class="scroll-link" data-id="application">Questions</a></li>
                        <li><a href="/IDUDaNang/pages/ask.jsf" class="scroll-link" data-id="location">Ask</a></li>
                        <li>
                            <c:if test="#{sessionScope.currentUser == null}">
                                <a class="scroll-link" data-toggle="modal"
                                   data-target="#loginModal" href="#">
                                    Login</a>
                            </c:if>
                            <c:if test="#{sessionScope.currentUser != null}">
                                <h:form id="logout">
                                    <h:commandButton styleClass="scroll-link btn btn-link" value="Đăng xuất" action="#{authencationBean.logout()}" />
                                </h:form>
                            </c:if>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
        <!-- Modal login -->
        <h:form>
            <div class="modal fade" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 
                 aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header label-info">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">X</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title text-center" id="myModalLabel" style="font-size: large; font-weight: bold; color: #ffffff">ĐĂNG NHẬP</h4>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-3">
                                    <h:outputText value="Tên đăng nhập: " />
                                </div>
                                <div class="col-md-9">
                                    <h:inputText styleClass="form-control" value="#{authencationBean.user.userName}" /> 
                                </div>
                            </div>
                            <div class="row" style="margin-top: 10px">
                                <div class="col-md-3">
                                    <h:outputText value="Mật khẩu: " />
                                </div>
                                <div class="col-md-9">
                                    <h:inputSecret styleClass="form-control" value="#{authencationBean.user.pwd}" />
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">  
                            <div class="row" style="margin: 0 10px 10px 0">
                                <h:commandButton class="btn btn-primary" value="OK" actionListener="#{authencationBean.checkLogin()}" />
                                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                            </div>
                            Bạn chưa có tài khoản? <a href="/IDUDaNang/pages/register.jsf">Đăng ký.</a>
                        </div>
                    </div>
                </div>
            </div>
        </h:form>
    </ui:composition>
</html>
